.account-entry{
  width 100%
  height 100vh
  display table
  // 移除原来的背景图片，添加炫酷的动画背景
  position relative
  overflow hidden
  
  // 添加炫酷的动画背景
  .background-animation {
    position absolute
    top 0
    left 0
    width 100%
    height 100%
    z-index 0
    overflow hidden
    
    .bg-bubbles {
      position absolute
      top 0
      left 0
      width 100%
      height 100%
      z-index 1
      
      li {
        position absolute
        list-style none
        display block
        width 40px
        height 40px
        background-color rgba(255, 255, 255, 0.15)
        bottom -160px
        animation square 25s infinite
        transition-timing-function linear
        
        &:nth-child(1) {
          left 10%
        }
        
        &:nth-child(2) {
          left 20%
          width 80px
          height 80px
          animation-delay 2s
          animation-duration 17s
        }
        
        &:nth-child(3) {
          left 25%
          animation-delay 4s
        }
        
        &:nth-child(4) {
          left 40%
          width 60px
          height 60px
          animation-duration 22s
          background-color rgba(255, 255, 255, 0.25)
        }
        
        &:nth-child(5) {
          left 70%
        }
        
        &:nth-child(6) {
          left 80%
          width 120px
          height 120px
          animation-delay 3s
          background-color rgba(255, 255, 255, 0.2)
        }
        
        &:nth-child(7) {
          left 32%
          width 160px
          height 160px
          animation-delay 7s
        }
        
        &:nth-child(8) {
          left 55%
          width 20px
          height 20px
          animation-delay 15s
          animation-duration 40s
        }
        
        &:nth-child(9) {
          left 25%
          width 50px
          height 50px
          animation-delay 1s
          animation-duration 20s
        }
        
        &:nth-child(10) {
          left 65%
          width 70px
          height 70px
          animation-delay 6s
          background-color rgba(255, 255, 255, 0.1)
        }
        
        &:nth-child(11) {
          left 15%
          width 30px
          height 30px
          animation-delay 9s
          animation-duration 30s
        }
        
        &:nth-child(12) {
          left 90%
          width 90px
          height 90px
          animation-delay 12s
        }
        
        &:nth-child(13) {
          left 45%
          width 40px
          height 40px
          animation-delay 5s
          animation-duration 25s
          background-color rgba(255, 255, 255, 0.2)
        }
        
        &:nth-child(14) {
          left 75%
          width 60px
          height 60px
          animation-delay 8s
        }
        
        &:nth-child(15) {
          left 5%
          width 100px
          height 100px
          animation-delay 14s
          animation-duration 35s
          background-color rgba(255, 255, 255, 0.18)
        }
      }
    }
    
    // 渐变动画背景
    .gradient-bg {
      position absolute
      top 0
      left 0
      width 100%
      height 100%
      background linear-gradient(45deg, #1e3c72, #2a5298, #0455b1, #0a73d6)
      background-size 400% 400%
      animation gradientBG 15s ease infinite
      z-index 0
    }
  }
  
  .login{
    width 525px
    padding 20px 0 40px 0
  }
  .regist {
    position relative
    width 625px
    padding 40px 40px 0 40px
    .title {
      &:after {
        content ''
        display inline-block
        width 100px
        height 2px
        background #0455b1
        position relative
        top -15px
        left 10px
      }
      &:before {
        content ''
        display inline-block
        width 100px
        height 2px
        background #0455b1
        position relative
        top -15px
        right 10px
      }
    }
    .left-btn {
      padding 15px 0
      >a {
        color #d4d4d4
        font-size 18px
        > span {
          color #0455b1
        }
      }
    }
    .right-btn {
      padding 15px 0
      font-size 18px
      text-align center
      .a {
        color #0455b1
      }
    }
    .sendCode {
      background #0455b1
      border-color #0455b1
      padding 12px 16px
      display block
      width 100%
    }

    .el-button--primary.is-disabled,
    .el-button--primary.is-disabled:active,
    .el-button--primary.is-disabled:focus,
    .el-button--primary.is-disabled:hover {
      background #97aeff
      border-color #97aeff
    }
    .validate-code {
      height 38px
      width 100%
      border-radius 4px
      cursor pointer
    }
    .head-top{
      position absolute
      top 0
      right 0
      width 145px
      height 100px
      background url(../../assets/login/top_1.png) no-repeat top right
      background-size 145px 100px
      font-size 16px
      text-align right
      padding-right 10px
      line-height 80px
      >a{
        font-weight bold
        color: #0455b1
      }
    }
  }
  .forget-password{
    padding 40px;
    .sendCode{
      background #0455b1
    }
}
  .agreement {
    cursor pointer
    color $color-global-blue
  }

  .mb10 {
    margin-bottom 10px
  }
  .wait {
    color: #fff;
  }

  .show {
    display: block;
  }

  .hide {
    display: none;
  }

  .topnav{
    position fixed
    top 0
    left 0
    right 0
    z-index 100
  }
  .account-wrap{
    display table-cell
    vertical-align middle
    //background url(../../assets/login/logo.png) no-repeat center 10%;
    //background-size 285px 95px
    position relative
    z-index 10
  }
  .account-content{
    margin 0 auto
    background rgba(255, 255, 255, 0.1)
    backdrop-filter blur(10px)
    box-sizing border-box
    border-radius 25px
    box-shadow 0 15px 35px rgba(0, 0, 0, 0.5)
    border 1px solid rgba(255, 255, 255, 0.1)
    position relative
    overflow hidden
    z-index 10
    
    // 添加发光边框效果
    &::before {
      content ''
      position absolute
      top -2px
      left -2px
      right -2px
      bottom -2px
      background linear-gradient(45deg, #0455b1, #0a73d6, #1e3c72, #2a5298)
      background-size 400%
      z-index -1
      border-radius 27px
      animation animate 20s linear infinite
    }
    
    .noindent{
      input{
        background #fff
        color #000
      }
    }
    .el-form-item{
      input{
        background rgba(255, 255, 255, 0.85)
        color #000
        border-radius 5px
        border 1px solid rgba(255, 255, 255, 0.2)
      }
      .ipt{
        input{
          text-indent 35px
        }

      }
      .email{
        input{
          background url(../../assets/login/email.png) rgba(255, 255, 255, 0.85) no-repeat center left 10px
          background-size 32px 26px
          border 1px solid rgba(255, 255, 255, 0.2)
        }
      }
      .user{
        input{
          background url(../../assets/login/user.png) rgba(255, 255, 255, 0.85) no-repeat center left 10px
          background-size 32px 26px
          border 1px solid rgba(255, 255, 255, 0.2)
        }
      }
      .pass{
        input{
          background url(../../assets/login/pass.png) rgba(255, 255, 255, 0.85) no-repeat center left 10px
          background-size 32px 26px
          border 1px solid rgba(255, 255, 255, 0.2)
        }
      }
      .code{
        input{
          background url(../../assets/login/code.png) rgba(255, 255, 255, 0.85) no-repeat center left 10px
          background-size 32px 26px
          border 1px solid rgba(255, 255, 255, 0.2)
        }
      }
      .vcode{
        input{
          background url(../../assets/login/vcode.png) rgba(255, 255, 255, 0.85) no-repeat center left 10px
          background-size 32px 26px
          border 1px solid rgba(255, 255, 255, 0.2)
        }
      }

    }
    .title {
      text-align center
      color #0455b1
      font-size 48px
      margin-bottom 20px
      text-shadow 0 0 10px rgba(4, 85, 177, 0.5)
    }
    .content-box{

      display flex
      justify-content space-between
      >div{
      }
      .box-l{
        width 40%
        text-align center
        >img{
          width 210px
          height 210px
        }
        >p{
          font-size 18px
          color #000
          padding 30px 0 0 0
        }
      }
      .box-r{
        width 85%
        margin 0 auto
        padding 0 50px
        //border-left  1px #464646 solid
      }
    }
    .account-help{
      position relative
      width 100%
      .help-box{
        display flex
        justify-content space-between
        .left-btn,.right-btn{
          font-size 14px
          color #AAABB1
          margin 5px 0
          .a{
            color #0455b1
          }
        }
      }
    }
  }

  .button-primary{
    display block
    width 100%
    background linear-gradient(45deg, #0455b1, #0a73d6)
    border-color #0455b1
    color #fff
    font-size 26px
    border-radius 5px
    cursor pointer
    box-shadow 0 5px 15px rgba(4, 85, 177, 0.4)
    position relative
    overflow hidden
    z-index 1
    
    // 添加按钮动画效果
    &::before {
      content ''
      position absolute
      top 0
      left -100%
      width 100%
      height 100%
      background linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent)
      transition all 0.6s
    }
    
    &:hover::before {
      left 100%
    }
    
    &:hover {
      background linear-gradient(45deg, #0a73d6, #0455b1)
      box-shadow 0 8px 25px rgba(4, 85, 177, 0.6)
      transform translateY(-3px)
      transition all 0.3s ease
    }
  }
  .el-input__inner{
    background rgba(255, 255, 255, 0.85)
    border-color rgba(255, 255, 255, 0.5)
    color #333
  }
  .el-input__inner:focus{
    color #000
    border-color #0455b1
    box-shadow 0 0 8px rgba(4, 85, 177, 0.5)
  }
  .el-select .el-input.is-focus .el-input__inner{
    border-color #0455b1
  }
}

// 添加动画关键帧
@keyframes gradientBG {
  0% {
    background-position 0% 50%
  }
  50% {
    background-position 100% 50%
  }
  100% {
    background-position 0% 50%
  }
}

@keyframes square {
  0% {
    transform translateY(0) rotate(0deg)
    opacity 1
    border-radius 0
  }
  100% {
    transform translateY(-1000px) rotate(720deg)
    opacity 0
    border-radius 50%
  }
}

@keyframes animate {
  0% {
    background-position 0 0
  }
  50% {
    background-position 400% 0
  }
  100% {
    background-position 0 0
  }
}